<template>
  <view class="member-center">
    <view class="logo">
		
	</view>
	<view class="title">请上传身份证正反面</view>
	<view class="content">
		<view class="tpbox1">
			<!--
			<uni-icons class="icons" type="minus-filled" color="red" size="25" @click="scimg(0,index1)"></uni-icons>
			<image mode="aspectFit" :src='item1' >
			</image>-->
			
				<img :src="card1" @click="chooseImage(0)"/>
			
				<img :src="card2" @click="chooseImage(1)"/>
			
		</view>
		
	</view>
	<view class="title">请上传药品经营许可证</view>
	
	<view class="content">
		<view class="tpbox"  v-for="(item1,index1) in manage_card">
			<uni-icons class="icons" type="minus-filled" color="red" size="25" @click="scimg(0,index1)"></uni-icons>
			<image mode="aspectFit" :src='item1' >
			</image>
		</view>
		<view class="addImage_btn"><label  @click="chooseImage(2)">+</label></view>
	</view>
	<view class="title">请上传营业执照</view>
	
	<view class="content">
		<view class="tpbox"  v-for="(item1,index1) in license_card">
			<uni-icons class="icons" type="minus-filled" color="red" size="25" @click="scimg(0,index1)"></uni-icons>
			<image mode="aspectFit" :src='item1' >
			</image>
		</view>
		<view class="addImage_btn"><label  @click="chooseImage(3)">+</label></view>
	</view>
	<view class="submit_div">
		<view class="submit_btn" @click="cardsubmit()">证件上传</view>
		
	</view>
  </view>
</template>
<script>
// import { swiper, swiperSlide } from "vue-awesome-swiper";
import { mapGetters} from 'vuex';
import Recommend from "@/components/Recommend";
import { chooseImage } from "@/utils";
import { postUserCard,getUserInfo,getVipInfo, getVipTask, setDetection } from "@/api/user";
export default {
  name: "Poster",
  components: {
    // swiper,
    // swiperSlide,
    Recommend
  },
  props: {},
  data: function() {
    return {
       cardList:[],//身份证两面
	   manage_card:[],//经营许可
	   license_card:[],//营业执照
	   card1:"../../../static/images/angle.png",
	   card2:"../../../static/images/angle.png",
	   managecard:null,
	   licensecard:null
    };
  },
  watch: {
    
  },
  computed: mapGetters(['userInfo']),
  mounted: function() {
     this.getUserInfo();
    // that.swiper.on("slideChange", function() {
    //   that.activeIndex = that.swiper.activeIndex;
    //   that.getTask();
    // });
  },

  methods: {
	getUserInfo: function () {
	  let that = this;
	  getUserInfo().then((res) => {
	    
	  });
	}, 
	chooseImage(i) {
	  chooseImage((img) => {
	    console.log(img);
		if(i==0){
			 this.card1=img;
		}else if(i==1){
			  this.card2=img;
		}else if(i==2){
			 this.manage_card.push(img);
		}else if(i==3){
			 this.license_card.push(img);
		}
	     
	  });
	},
	scimg(i,n){
		this.cardList.splice(n,1);
	},
	cardsubmit:function(){
		let userInfo = this.userInfo;
		postUserCard({
		  card1: this.card1,
		  card2: this.card2,
		  managecard:this.manage_card[0],
		  licensecard:this.license_card[0]
		}).then(
		  (res) => {
		    this.$store.dispatch("userInfo", true);
		    uni.showToast({
		      title: res.msg,
		      icon: "none",
		      duration: 2000,
		    });
		    this.$yrouter.back();
		  },
		  (err) => {
		    uni.showToast({
		      title:
		        err.msg || err.response.data.msg || err.response.data.message,
		      icon: "none",
		      duration: 2000,
		    });
		  }
		);
	}
  }
};
</script>

<style lang="less">
.banner swiper {
  height: 328rpx;
}
.swiper-slide {
  margin: 0 auto;
}
</style>
